<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<div class="form-group">
	<label class="col-sm-3 control-label">是否开启模板：</label>
	<div class="col-sm-8">
		<button class="btn  btn-default btn-xs" type="button"
			onclick="imgbut(this);" name="open">开启</button>
		<button class="btn  btn-default btn-xs" type="button"
			onclick="imgbut(this);" name="close">关闭</button>
	</div>
</div>
<div class="form-group" id="template">
	<label class="col-sm-3 control-label">模板：</label>
	<div class="col-sm-8">
		<select id="select2_template" name="template.id" class="form-control"
			onchange="retrievals(this);">
			<option value="100" selected="selected"></option>
		</select>
	</div>
</div>

<script>
$(function(){
	$("div.panel-info").show();
	infoselect();
	$("#template").hide();
	$("button[name='open']").css("border","");
	$("button[name='close']").css("border","1px solid blue");
});

function infoselect(){
	var type = "${type}";
	if(type==""){
		type=$("#type").val();
	}
	$("#select2_template").select2({
	   	  ajax: {
	   		    url: "<%=contextPath%>/template/getBytype?id="+type,
					dataType : 'json',
					delay : 400,
					data : function(params) {
						return {
							name : params.term,
						};
					},
					processResults : function(data) {
						return {
							results : data
						};
					},
					cache : true
				},
				escapeMarkup : function(markup) {
					return markup;
				},
				minimumInputLength : 0,
				templateResult : function formatRepo(repo) {
					return repo.name
				},
				templateSelection : function formatRepoSelection(repo) {
					return repo.name
				}
			});
}

	function imgbut(obj) {
		if ($(obj).attr("name") == "open") {
			$("#template").show();
			infoselect(); //初始化下拉列表
			$(obj).css("border", "1px solid blue");
			$("button[name='close']").css("border", "");
		} else {
			$("#select2_template").text("");//清空下拉显示值
			$("#select2_template").val("100");//关闭模板恢复下拉默认值
			$("#template").hide();
			$("#tbody").html("");//自定义区域清空
			$("button[name='open']").css("border", "");
			$("button[name='close']").css("border", "1px solid blue");
		}
	}

	function retrievals(obj) {
		retrieval("<%=contextPath %>/template/getByid?id="+$(obj).val());
	}
</script>